<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- id:只有一个而且不能重复（相当于身份证号） -->
    <!-- 锚点跳转：给每一个模块用id起一个名字，a标签里面的href的值应该是# 加上id里面的那个名字 -->
    <p style="height:500px;background-color: red;" id="one">111</p>
    <p style="height:500px;background-color: blue;" id="two">222</p>
    <p style="height:500px;background-color: yellow;" id="three">333</p>

    <a href="#one">红色</a>
    <a href="#two">蓝色</a>
    <a href="#three">黄色</a>

    <hr>
    <!-- 未点击蓝色  长按红色  触发后紫色 -->
    <!-- a 超链接：跳转页面-->
    <!-- href：页面网址/html文件 -->
    <!-- 默认替换掉当前页面: target="_self" (可以省略不写) -->
    <!-- 打开新窗口：target="_blank" -->

    <a href="http://www.baidu.com">baidu</a>
    <a href="demo1.html" target="_blank">demo1</a>

    <!-- href="#"：返回顶部 -->
    <a href="#">返回顶部</a>
    <!-- href="javascript:;" :什么也不做 禁止跳转  -->
    <a href="javascript:;">什么也不做</a>

    

</body>
</html>